<template>
	<div class="flex items-center text-sm">
		<div v-if="match.type !== MatchType.outright" class="mr-1">{{ market.marketTypeName }}</div>
		<n-popover v-if="showText" trigger="hover">
			<template #trigger>
				<base-icon name="about" />
			</template>
			<div class="p-5 w-[400px] whitespace-pre-wrap break-words text-sm text-t-1">
				{{ showText }}
			</div>
		</n-popover>
	</div>
</template>

<script lang="ts" setup>
import { NPopover } from 'naive-ui'
import { BaseIcon } from '@/components/base'
import { Match, Market } from '@/types'
import { MatchType, BettingTypeCode, SportsType } from '@/enums'
import { PropType, computed } from 'vue'
import { t } from '@/utils'

const props = defineProps({
	match: {
		type: Object as PropType<Match>,
		required: true
	},
	market: {
		type: Object as PropType<Market>,
		required: true
	}
})

const showText = computed(() => {
	const { marketId } = props.market
	const marketCode = marketId.substring(1, 3)
	let res = ''
	switch (marketCode) {
		case BettingTypeCode.handicap:
			res = getHandicapText()
			break
		case BettingTypeCode.ou:
			res = getOUText()
			break
		case BettingTypeCode.moneyline:
			res = getMoneylineText()
			break
		case BettingTypeCode.exactScore:
			res = getExactScoreText()
			break
	}
	return res || props.market.marketTypeDesc || ''
})

const getHandicapText = () => {
	const { sportId } = props.match
	if (sportId === SportsType.football || sportId === SportsType.fifa24) {
		return getHandicapTextFootball()
	} else if (sportId === SportsType.basketball || sportId === SportsType.nba2k) {
		return getHandicapTextBasketball()
	} else if (sportId === SportsType.badminton) {
		return getHandicapTextBadminton()
	} else if (sportId === SportsType.tennis) {
		return getHandicapTextTennis()
	} else {
		return ''
	}
}

const getHandicapTextBadminton = () => {
	const { homeTeamName: home, awayTeamName: away } = props.match
	const points = props.market.selections[0].points || 0
	const isPos = points > 0
	let tKey = ''
	if (points === 0) {
		tKey = 'zero'
	} else {
		tKey += isPos ? 'pos' : 'neg'
	}
	return t(`market.badminton.handicap.${tKey}`, {
		home,
		away
	})
}

const getHandicapTextTennis = () => {
	const { marketTypeId } = props.market
	if (marketTypeId === 'HC714' || marketTypeId === 'HC738') {
		return ''
	}
	const { homeTeamName: home, awayTeamName: away } = props.match
	const points = props.market.selections[0].points || 0
	const isPos = points > 0
	const [intValStr, decimalValStr] = ('' + Math.abs(points)).split('.')
	const intVal = +intValStr
	const decimalVal = +decimalValStr
	let tKey = isPos ? 'pos' : 'neg'
	tKey += intVal
	if (!isNaN(decimalVal)) {
		tKey += 'd' + decimalVal
	}
	return t(`market.tennis.handicap.${tKey}`, {
		home,
		away
	})
}

const getHandicapTextBasketball = () => {
	const { homeTeamName: home, awayTeamName: away } = props.match
	const points = props.market.selections[0].points || 0
	const isPos = points > 0
	const [intValStr, decimalValStr] = ('' + Math.abs(points)).split('.')
	const intVal = +intValStr
	const decimalVal = +decimalValStr
	let tKey = ''
	if (points === 0) {
		tKey = 'zero'
	} else {
		tKey += isPos ? 'pos' : 'neg'
		tKey += Math.min(intVal, 3)
		if (!isNaN(decimalVal)) {
			tKey += 'd' + decimalVal
		}
	}
	let num1, num2
	if (intVal >= 3) {
		if (!isPos && isNaN(decimalVal)) {
			num1 = intVal + 1
			num2 = intVal - 1
		} else if (isPos && isNaN(decimalVal)) {
			num1 = intVal - 1
			num2 = intVal + 1
		} else if (!isPos && decimalVal === 5) {
			num1 = intVal + 1
			num2 = intVal
		} else if (isPos && decimalVal === 5) {
			num1 = intVal
			num2 = intVal + 1
		}
	}
	return t(`market.basketball.handicap.${tKey}`, {
		home,
		away,
		num1,
		num2
	})
}

const getHandicapTextFootball = () => {
	const { homeTeamName: home, awayTeamName: away, isLive } = props.match
	if (isLive) {
		return t('market.football.handicapLive')
	}
	const points = props.market.selections[0].points || 0
	const isPos = points > 0
	const [intValStr, decimalValStr] = ('' + Math.abs(points)).split('.')
	const intVal = +intValStr
	const decimalVal = +decimalValStr
	let tKey = ''
	if (points === 0) {
		tKey = 'zero'
	} else {
		tKey += isPos ? 'pos' : 'neg'
		tKey += Math.min(intVal, 3)
		if (!isNaN(decimalVal)) {
			tKey += 'd' + decimalVal
		}
	}
	let num1, num2, num3, num4, num5, num6
	if (intVal >= 3) {
		if (isPos && decimalVal === 75) {
			num1 = num6 = intVal
			num2 = num5 = intVal + 1
			num3 = num4 = intVal + 2
		} else if (!isPos && decimalVal === 75) {
			num1 = num6 = intVal + 2
			num2 = num5 = intVal + 1
			num3 = num4 = intVal
		} else if (isPos && decimalVal === 25) {
			num1 = intVal - 1
			num2 = num4 = intVal
			num3 = intVal + 1
		} else if (!isPos && decimalVal === 25) {
			num1 = intVal + 1
			num2 = num4 = intVal
			num3 = intVal - 1
		} else if (isPos && decimalVal === 5) {
			num1 = intVal
			num2 = intVal + 1
		} else if (!isPos && decimalVal === 5) {
			num1 = intVal + 1
			num2 = intVal
		} else if (isPos && isNaN(decimalVal)) {
			num1 = intVal - 1
			num2 = num4 = intVal
			num3 = intVal + 1
		} else if (!isPos && isNaN(decimalVal)) {
			num1 = intVal + 1
			num2 = num4 = intVal
			num3 = intVal - 1
		}
	}
	return t(`market.football.handicap.${tKey}`, {
		home,
		away,
		num1,
		num2,
		num3,
		num4,
		num5,
		num6
	})
}

const getOUText = () => {
	const { sportId } = props.match
	if (sportId === SportsType.tennis) {
		return getOUTextTennis()
	} else if (
		sportId !== SportsType.football &&
		sportId !== SportsType.basketball &&
		sportId !== SportsType.fifa24 &&
		sportId !== SportsType.nba2k
	) {
		return ''
	}
	const sportType =
		sportId === SportsType.football || sportId === SportsType.fifa24 ? 'football' : 'basketball'
	const { points } = props.market.selections[0]
	const [intValStr, decimalValStr] = ('' + points).split('.')
	const intVal = +intValStr
	const decimalVal = +decimalValStr
	if (intVal >= 2 && decimalVal === 25) {
		const num1 = intVal + 1
		const num2 = intVal
		const num3 = intVal - 1
		const num4 = intVal
		return t(`market.${sportType}.ou.over2d5`, { num1, num2, num3, num4 })
	} else if (intVal >= 2 && isNaN(decimalVal)) {
		const num1 = intVal + 1
		const num2 = intVal
		const num3 = intVal - 1
		const num4 = intVal
		return t(`market.${sportType}.ou.over2`, { num1, num2, num3, num4 })
	} else if (intVal >= 1 && decimalVal === 75) {
		const num1 = intVal + 2
		const num2 = intVal + 1
		const num3 = intVal
		const num4 = intVal + 1
		return t(`market.${sportType}.ou.over1d75`, { num1, num2, num3, num4 })
	} else if (intVal >= 1 && decimalVal === 5) {
		const num1 = intVal + 1
		const num2 = intVal
		return t(`market.${sportType}.ou.over1d5`, { num1, num2 })
	} else if (intVal === 1 && decimalVal === 25) {
		return t(`market.${sportType}.ou.over1d25`)
	} else if (intVal === 1 && isNaN(decimalVal)) {
		return t(`market.${sportType}.ou.over1`)
	} else if (intVal === 0 && decimalVal === 5) {
		return t(`market.${sportType}.ou.over0d5`)
	} else if (intVal === 0 && decimalVal === 75) {
		return t(`market.${sportType}.ou.over0d75`)
	} else {
		return ''
	}
}

const getOUTextTennis = () => {
	const { marketTypeId } = props.market
	if (marketTypeId === 'OU714' || marketTypeId === 'OU738') {
		return ''
	}
	const { points } = props.market.selections[0]
	const num1 = Math.ceil(+!points)
	return t(`market.tennis.ou`, { num1 })
}

const getMoneylineText = () => {
	const { homeTeamName: home, awayTeamName: away, sportId } = props.match
	return t(
		sportId === SportsType.football || sportId === SportsType.fifa24
			? 'market.football.moneyline'
			: 'market.moneyline',
		{
			home,
			away
		}
	)
}

const getExactScoreText = () => {
	const { sportId } = props.match
	if (sportId === SportsType.football || sportId === SportsType.fifa24) {
		return t('market.football.exactScore')
	} else {
		return t('market.exactScore')
	}
}
</script>
